<template>
  <div class="about">
    <h1>关于我们</h1>
    <main>
      <div class="row">
        <div class="column">
          <h2>公司简介</h2>
          <p>这里是公司简介。</p>
        </div>
        <div class="column">
          <h2>团队介绍</h2>
          <p>这里是团队介绍。</p>
        </div>
      </div>
    </main>
    <p>Copyright © 2024 com.lai</p>
  </div>
</template>

<style scoped>
.about {
  background-image: url('/p2.webp'); 
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  margin: 5px;
  padding: 5px;
  min-height: 100vh; 
  display: flex;
  flex-direction: column;
  align-items: center;
}


header h1 {
  margin: 0;
}

main {
  flex: 1;
  width: 100%;
}

.row {
  display: flex;
  justify-content: center; 
  gap: 20px;
}

.column {
  border-radius: 4px;
  padding: 20px;
  background: rgba(255, 255, 255, 0.8); /* Use rgba for transparency */
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
  max-width: 500px;
  width: 100%;
  text-align: center;
}
</style>
